{#分类页面#}
{{ header }}
<div class="category-top-img" style="background: url('catalog/view/theme/default/image/category_bg.jpg');">
    {#<img src="catalog/view/theme/default/image/category_bg.jpg" alt="">#}
    <div class="container">
        <h1>{{ heading_title }}</h1>
    </div>
</div>
<div class="category-top-select">
    <div class="container">
        <div class="row">
            <div class="col-md-3 col-sm-6 hidden-xs">
                <!--<div class="form-group"><a href="{{ compare }}" id="compare-total" class="btn btn-link">{{ text_compare }}</a></div>-->
                <div class="form-group" style="display:none;">
                    <select class="form-control" onchange="location = this.value;">
                        <option value="{{ colorsdf }}">Color</option>
                        {% for colors in colors %}
                            {% if colors.value == color %}
                                <option value="{{ colors.href }}" selected="selected">{{ colors.text }}
                                    ({{ colors.num }})
                                </option>
                            {% else %}
                                <option value="{{ colors.href }}">{{ colors.text }} ({{ colors.num }})</option>
                            {% endif %}
                        {% endfor %}
                    </select>
                </div>
            </div>
            <div class="col-xs-6 hidden-lg hidden-md hidden-sm">
                <div id="category-filter">
                    <i class="fa fa-filter"></i>Filter<i class="fa fa-angle-right"></i>
                </div>
            </div>
            <div class="col-xs-6 hidden-lg hidden-md hidden-sm">
                {#<label class="input-group-addon" for="input-sort">{{ text_sort }}</label>#}
                <select class="form-control input-sort" onchange="location = this.value;">
                    {% for sorts in sorts %}
                        {% if sorts.value == '%s-%s'|format(sort, order) %}
                            <option value="{{ sorts.href }}" selected="selected">{{ sorts.text }}</option>
                        {% else %}
                            <option value="{{ sorts.href }}">{{ sorts.text }}</option>
                        {% endif %}
                    {% endfor %}
                </select>
            </div>
        </div>
        <div id="category-filter-box" style="display: none">
            <div class="filter-title">Filter:</div>
            <hr />
            <div class="form-group">
                <select class="form-control" onchange="location = this.value;">
                    <option value="{{ colorsdf }}">Color</option>
                    {% for colors in colors %}
                        {% if colors.value == color %}
                            <option value="{{ colors.href }}" selected="selected">{{ colors.text }}
                                ({{ colors.num }})
                            </option>
                        {% else %}
                            <option value="{{ colors.href }}">{{ colors.text }} ({{ colors.num }})</option>
                        {% endif %}
                    {% endfor %}
                </select>
            </div>
        </div>
    </div>
</div>
<script>
    $('#category-filter').on('click',function(){
        $('#category-filter-box').slideToggle();
        $(this).toggleClass('active');
    })
</script>
<div id="product-category">
    <div class="container">
    {#<ul class="breadcrumb">#}
    {#{% for breadcrumb in breadcrumbs %}#}
    {#<li><a href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a></li>#}
    {#{% endfor %}#}
    {#</ul>#}
        <div class="row">
            {#{{ column_left }}#}
            {#{% if column_left and column_right %}#}
            {#{% set class = 'col-sm-6' %}#}
            {#{% elseif column_left or column_right %}#}
            {#{% set class = 'col-sm-9' %}#}
            {#{% else %}#}
            {#{% set class = 'col-sm-12' %}#}
            {#{% endif %}#}
            <div id="content" class="col-sm-12">
                {% if products %}

                    <div class="row"> {% for product in products %}
                            <div class="col-xs-12 col-sm-4">
                                <div class="product-thumb goods-list">
                                    <h4 class="caption-title hidden-sm hidden-xs"><a href="{{ product.href }}">{{ product.name }}</a></h4>
                                    <div class="image"><a href="{{ product.href }}"><img src="{{ product.thumb }}"
                                                                                         alt="{{ product.name }}"
                                                                                         title="{{ product.name }}"
                                                                                         class="img-responsive"
                                                                                         style="width: 100%;"/></a></div>
                                    <div>
                                        <div class="caption">
                                            <h4 class="caption-title hidden-lg hidden-md"><a href="{{ product.href }}">{{ product.name }}</a></h4>
                                            {#<p>{{ product.description }}</p>#}
                                            {% if product.price %}
                                                <p class="price">
                                                {% if not product.special %}
                                                    <div class="no-special">{{ product.price }}</div>
                                                {% else %}
                                                    <div class="row"><span class="price-old text-center">{{ product.price }}</span><span class="price-new text-center">{{ product.special }}</span></div>
                                                    <div class="price-tax text-center">Save Off: {{ product.saveoff }}%</div>
                                                {% endif %}
                                                {% if product.tax %}
                                                    {#<span class="price-tax">{{ text_tax }} {{ product.tax }}</span>#}
                                                {% endif %}
                                                </p>
                                            {% endif %}
                                            {% if product.rating %}
                                                <div class="rating"> {% for i in 1..5 %}
                                                        {% if product.rating < i %} <span class="fa fa-stack"><i
                                                                    class="fa fa-star-o fa-stack-2x"></i></span> {% else %}
                                                            <span class="fa fa-stack"><i class="fa fa-star fa-stack-2x"></i><i
                                                                        class="fa fa-star-o fa-stack-2x"></i></span>{% endif %}
                                                    {% endfor %} </div>
                                            {% endif %} </div>
                                        {#<div class="button-group">#}
                                            {#<button type="button"#}
                                                    {#onclick="cart.add('{{ product.product_id }}', '{{ product.minimum }}');">#}
                                                {#<i class="fa fa-shopping-cart"></i> <span#}
                                                        {#class="hidden-xs hidden-sm hidden-md">{{ button_cart }}</span>#}
                                            {#</button>#}
                                            {#<button type="button" data-toggle="tooltip" title="{{ button_wishlist }}"#}
                                                    {#onclick="wishlist.add('{{ product.product_id }}');"><i#}
                                                        {#class="fa fa-heart"></i></button>#}
                                            {#<button type="button" data-toggle="tooltip" title="{{ button_compare }}"#}
                                                    {#onclick="compare.add('{{ product.product_id }}');"><i#}
                                                        {#class="fa fa-exchange"></i></button>#}
                                        {#</div>#}
                                    </div>
                                </div>
                            </div>
                        {% endfor %} </div>
                    <div class="row">
                        <div class="col-sm-6 text-left hidden-xs page-info">
                            {{ results }}
                            Show:
                            <div class="perPage">
                                <select class="form-control" onchange="location = this.value;">
                                    {% for limits in limits %}
                                        {% if limits.value == limit %}
                                            <option value="{{ limits.href }}" selected="selected">{{ limits.text }}</option>
                                        {% else %}
                                            <option value="{{ limits.href }}">{{ limits.text }}</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                            </div>
                            SortBy:
                            <div class="sortBy">
                                <select class="form-control input-sort" onchange="location = this.value;">
                                    {% for sorts in sorts %}
                                        {% if sorts.value == '%s-%s'|format(sort, order) %}
                                            <option value="{{ sorts.href }}" selected="selected">{{ sorts.text }}</option>
                                        {% else %}
                                            <option value="{{ sorts.href }}">{{ sorts.text }}</option>
                                        {% endif %}
                                    {% endfor %}
                                </select>
                            </div>
                        </div>
                        <div class="col-sm-6 text-right">{{ pagination }}</div>
                    </div>
                {% endif %}
                {% if not categories and not products %}
                    <p>{{ text_empty }}</p>
                    <div class="buttons">
                        <div class="pull-right"><a href="{{ continue }}" class="btn btn-primary">{{ button_continue }}</a>
                        </div>
                    </div>
                {% endif %}
                {{ content_bottom }}</div>
            {{ column_right }}</div>
    </div>
</div>
{{ footer }} 
